<script lang="ts">
export default defineComponent({
  setup: function () {
    const route = useRouter()
    const countDown = ref(5)

    const Iter = setInterval(() => {
      countDown.value--
      if (countDown.value === 0)
        toHomePage()
    },1000)

    function toHomePage(){
      clearInterval(Iter)
      route.push('/home')
    }
    return {
      countDown,
      toHomePage
    }
  }


})

</script>

<template>
  <div class="main-box">
    <n-result status="500" title="500 服务器错误" :description="'服务器出错，'+ countDown +'秒后返回主页'">
      <template #footer>
        <n-button @click="toHomePage()">返回主页</n-button>
      </template>
    </n-result>
  </div>
</template>

<style lang="scss" scoped>
.main-box {
  display: flex;
  position: fixed;
  top: 48%;
  left: 50%;
  transform: translate(-50%,-50%);

}
</style>

<route>
{
meta: {
title: '500',
hidden: true,
noShowTabbar: true,
}
}
</route>